<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    :confirmLoading="confirmLoading"
    switchFullscreen
    :footer="false"
    @cancel="handleCancel"
    cancelText="关闭"
  >
    <a-form-model ref="form" :model="model" :rules="validatorRules" :label-col="labelCol" :wrapper-col="wrapperCol">
      <a-row>
        <a-col :span="12">
          <a-form-model-item label="开工日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="startTime">
            <j-date v-model="model.startTime" format="YYYY-MM-DD"></j-date>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="计划完工日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="planFinishTime">
            <j-date v-model="model.planFinishTime" format="YYYY-MM-DD"></j-date>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="日期序列" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="deliveryDate">
            <a-select v-model="model.documentDate">
              <a-select-option v-for="d in dateList" :key="d.value">
                {{ d.title }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
      </a-row>
    </a-form-model>
    <a-button v-if="!editable" type="primary" @click="editable = true" style="margin-bottom: 10px;margin-top: -10px;"
      >编辑全部
    </a-button>
    <a-button v-else type="primary" @click="editable = false" style="margin-bottom: 10px;margin-top: -10px;"
      >保存全部
    </a-button>
    <a-table
      ref="table"
      size="small"
      bordered
      rowKey="id"
      :scroll="{ x: true }"
      :columns="columns"
      :dataSource="dataSource"
      :pagination="false"
      :loading="loading"
    >
      <template slot="planProduceNumber" slot-scope="text, record">
        <a-input-number v-if="editable" v-model="record.planProduceNumber" :min="0" style="width: 80px" />
        <span v-else>{{ record.planProduceNumber }}</span>
      </template>
    </a-table>
    <a-button
      type="primary"
      :loading="confirmLoading"
      @click="generateMission"
      style="margin-left: calc(100% - 130px);margin-top: 10px"
      >生成生产任务单
    </a-button>
  </j-modal>
</template>

<script>
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import dayjs from 'dayjs'
import { postAction } from '@api/manage'

export default {
  name: 'GenerateMission',
  mixins: [JeecgListMixin],
  props: ['sourceId', 'sourceSerial'],
  data() {
    return {
      title: '生成生产任务单',
      width: 1200,
      visible: false,
      confirmLoading: false,
      disableMixinCreated: true,
      editable: false,
      model: {},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 10 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 14 }
      },
      dateList: [],
      validatorRules: {
        documentDate: [{ required: true, message: '请选择日期序列!' }],
        planFinishTime: [{ required: true, message: '请选择计划完工日期!' }],
        startTime: [{ required: true, message: '请选择开工日期!' }]
      },
      columns: [
        {
          title: '序号',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: function(t, r, index) {
            return parseInt(index) + 1
          }
        },
        {
          title: '物料代码',
          align: 'center',
          dataIndex: 'materialCode',
          scopedSlots: { customRender: 'materialCode' }
        },
        {
          title: '物料名称',
          align: 'center',
          dataIndex: 'materialName'
        },
        {
          title: '规格型号',
          align: 'center',
          dataIndex: 'sap'
        },
        {
          title: '单位',
          align: 'center',
          dataIndex: 'unit_dictText'
        },
        {
          title: '物料类型',
          align: 'center',
          dataIndex: 'materialType_dictText'
        },
        {
          title: '数量',
          align: 'center',
          dataIndex: 'planProduceNumber',
          scopedSlots: { customRender: 'planProduceNumber' }
        }
      ],
      dataSource: [],
      loading: false,
      url: {
        generateMission: '/production/hfProductmission/generateMission'
      }
    }
  },
  methods: {
    close() {
      this.$emit('close')
      this.visible = false
    },
    handleCancel() {
      this.close()
    },
    loadData(data) {
      this.dataSource = data.map(item => ({ ...item, maxNumber: item.number, planProduceNumber: 0 }))
      this.dateList = this.dataSource.at(-1).dateList.map(item => ({ value: item, title: item }))
    },
    generateMission() {
      let param = this.dataSource.map(item => {
        return {
          materialCode: item.materialCode,
          materialName: item.materialName,
          sap: item.sap,
          unit: item.unit,
          materialType: item.materialType,
          warehouse: item.warehouse,
          planProduceNumber: item.planProduceNumber
        }
      })

      let url = `${this.url.generateMission}?sourceId=${this.sourceId}&sourceSerial=${this.sourceSerial}&documentDate=${this.model.documentDate}&startTime=${this.model.startTime}&planFinishTime=${this.model.planFinishTime}&sourceType=SOD`
      postAction(url, param)
        .then(res => {
          if (res.success) {
            this.$message.success(res.message)
          } else {
            this.$message.error(res.message)
          }
        })
        .finally(() => {
          this.close()
        })
    }
  }
}
</script>

<style scoped></style>
